{% extends 'index.html' %}
{% load time_filter %}
{% block content %}
 <div class="breadcrumbs">
        <div class="breadcrumbs-inner">
            <div class="row m-0">
                <div class="col-sm-4">
                    <div class="page-header float-left">
                        <div class="page-title">
                            <h1>京乳时鲜 &emsp;&emsp;&emsp;仓库号&emsp;&emsp;{{warehouseID}}</h1>
                        </div>
                    </div>
                </div>
                <div class="col-sm-8">
                    <div class="page-header float-right">
                        <div class="page-title">
                            <ol class="breadcrumb text-right">
                                <li><a href="{% url 'index' %}">主页</a></li>
                                <li class="active">采购订单生成</li>
                            </ol>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="content">
        <div class="row">
            <div class="col-lg-12">
                <div class="card">
                    <div class="card-header">
                        <h4>需求表查看</h4>
                    </div>
                    <div class="card-body">
                        <div class="tab-content" id="warehouse-tabContent">
                            <div class="tab-pane fade show active" id="pills-total" role="tabpanel" aria-labelledby="pills-total-tab">
                                <table id="bootstrap-data-table" class="table table-striped table-bordered">
                                    <thead>
                                        <tr>
                                            <th>需求表ID</th>
                                            <th>产生时间</th>
                                            <th>是否解决</th>
                                            <th>仓库ID</th>
                                            <th>操作详情</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <!-- /.todo-list -->
                                        {% for d in demand %}
                                            <tr>
                                                <td style="width:10%">{{d.number}}</td>
                                                <td style="width:12%">{{d.datetime|date:"Y-m-d h:m:s"}}</td>
                                                <td style="width:12%">{% if d.isSolved %}已解决{% else %}未解决{% endif %}</td>
                                                <td style="width:10%">{{d.warehouse.warehouse_id }}</td>
                                                <td style="width:12%"><a href="{% url 'final_demandlist' d.number%}" class="btn btn-primary" style="height:50%">处理解决</a></td>
                                            </tr>
                                        {% endfor %}
                                    </tbody>
                                    <tfoot>
                                    </tfoot>

                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block css_js_2 %}
    <link rel="stylesheet" href="/static/assets/css/lib/datatable/dataTables.bootstrap4.min.css">
{#    <script src="/static/assets/js/lib/data-table/jquery.dataTables1.10.18.min.js"></script>#}
    <script src="/static/assets/js/popper.min.js"></script>
    <script src="/static/assets/js/bootstrap.min.js"></script>
    <script src="/static/assets/js/jquery.matchHeight.min.js"></script>
    <script src="/static/assets/js/main.js"></script>


    <script src="/static/assets/js/lib/data-table/datatables1.10.18.min.js"></script>
    <script src="/static/assets/js/lib/data-table/dataTables.bootstrap4.min.js"></script>
    <script>
        jQuery(document).ready(function($) {
            $("#purchase").addClass("active");
            $("#add_demand").addClass("active");
            $("#p_toggle").trigger("click");
            $('#bootstrap-data-table').DataTable( {
                aLengthMenu: [
                    [10, 25, 50, 100, -1], [10, 25, 50, 100, "全部"]
                ],
                language:{
                    "info": "显示_START_至_END_项结果，共_TOTAL_项",
                    "search": "搜索:",
                    "paginate": {"previous": "上一页", "next": "下一页"},
                    "lengthMenu": "显示 _MENU_ 项",
                    "zeroRecords": "抱歉，没有找到符合条件的记录",
                    "infoFiltered": "(筛选自 _MAX_ 条总记录)",
                    "infoEmpty":"显示 0 至 0 项结果，共 0 项",
                },
                initComplete: function () {
                    this.api().columns([2, 3]).every( function () {
                        var column = this;
                        var select = $('<select class="form-control"><option value="">全选</option></select>')
                            .appendTo( $(column.footer()))
                            .on( 'change', function () {
                                var val = $.fn.dataTable.util.escapeRegex(
                                    $(this).val()
                                );
                                column
                                    .search( val ? '^'+val+'$' : '', true, false )
                                    .draw();
                            } );
                        $(select).click(function (e) {
                            e.stopPropagation();
                        });

                        column.data().unique().sort().each( function ( d, j ) {
                            select.append( '<option value="'+d+'">'+d+'</option>' )
                        } );
                    } );
                }
            } );
    });
    </script>
{% endblock %}